En el lado del nodo,
// Event 'uncaughtException' process.on('uncaughtException', (error, source) => { fs.writeSync(process.stderr.fd, error, source); });¿Cuál es el equivalente de lo anterior para la interfaz con ReacT?
El concepto más cercano de uncoughtException en React se llama "Límites de error":
https://reactjs.org/docs/error-boundaries.html
Estos elementos detectarán cualquier error de representación que ocurra dentro de su subárbol.
Dentro del método de render , puede mostrar algún tipo de mensaje de "error interno".
React 16 introdujo límites de error a través de un método de ciclo de vida de componente de clase: componentDidCatch , sin embargo, hay algunas advertencias que debe leer en la documentación a continuación.
componentDidCatch /* * Implementation */ class ErrorBoundary extends React.Component { constructor(props) { super(props); this.state = { hasError: false }; } componentDidCatch(error, info) { // Display fallback UI this.setState({ hasError: true }); // You can also log the error to an error reporting service logErrorToMyService(error, info); } render() { if (this.state.hasError) { // You can render any custom fallback UI return <h1>Something went wrong.</h1>; } return this.props.children; } } /* * Usage */ <ErrorBoundary> <MyWidget /> </ErrorBoundary>react-error-boundary Sin embargo, en lugar de implementar lo anterior, recomiendo usar algo como react-error-boundary de Brian Vaughn.
Es flexible, permite la recuperación de errores y no depende externamente de ningún método de ciclo de vida de React.
import {ErrorBoundary} from 'react-error-boundary' const ErrorFallback = () => <div>Something went wrong</div> const myErrorHandler = (error: Error, info: {componentStack: string}) => { // Do something with the error // Eg log to an error logging client here } const ui = ( <ErrorBoundary FallbackComponent={ErrorFallback} onError={myErrorHandler}> <ComponentThatMayError /> </ErrorBoundary>, )